<template>
  <ejs-autocomplete :dataSource='botsListData'
                    :placeholder="$t('custom.clientbot.selectbots')"
                    v-model="selectedBots"
                    @change="onchange"
                    :fields='botsFields'></ejs-autocomplete>
</template>

<script>
export default {
  data () {
    return {
      botsFields: {
        value: 'name'
      },

      botsListData: [],
      selectedBots: null
    }
  },
  created () {
    this.getBotsLists()
  },
  methods: {
    getBotsLists () {
      const params = {
        enable: true
      }
      this.$interface.bots.getBotsListApi(params)
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg)
          }
          this.botsListData = res.data
        })
    },
    onchange (e) {
      this.$emit('resetSearch', e.itemData.id)
    }
  }
}
</script>

<style scoped>

</style>
